/**
 * Created by Freeman on 2017/12/27.
 */
import React from 'react'
import {AsyncStorage, View} from 'react-native'
import Layout from "./base/Layout";
import BlockMenu from "./base/BlockMenu";
import {connect} from "react-redux";
import {bindActionCreators} from 'redux'
import {logout} from '../store/auth/actions'
import {COLOR} from "../config";
import BlockButton from "./base/BlockButton";

const Settings = ({navigation, auth, logoutAction}) => {

  return (
    <Layout>
      <View style={{
        flex: 1,
        marginTop: 10,
        paddingVertical: 0,
      }}
      >
        <BlockMenu
          onPress={() => navigation.navigate('About')}
          leftIcon={'ios-information-circle'}
          rightIcon={'ios-arrow-forward'}
          text={'关于'}
        />
        <BlockButton onClick={() => AsyncStorage.clear()}>清除数据</BlockButton>
        {
          auth.isLogged &&
          <BlockButton onClick={() => logoutAction().then(() => navigation.goBack())}>退出登录</BlockButton>
        }
      </View>
    </Layout>
  )
}

Settings.navigationOptions = ({navigation}: any) => ({
  headerTitle: '设置',
  headerStyle: {
    backgroundColor: COLOR.backgroundLighter,
  },
})

const mapStateToProps = state => {

  const {
    auth
  } = state
  return {
    auth
  }
}


const mapDispatchToProps = dispatch => (
  {
    logoutAction: bindActionCreators(logout, dispatch)
  }
)

export default connect(mapStateToProps, mapDispatchToProps)(Settings)
